Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

AlphaIcon component #2566

Open
wants to merge 18 commits into
base: main
Choose a base branch
from
Open

Conversation

sungik-choi
Copy link
Contributor

@sungik-choi sungik-choi commented Dec 16, 2024

Self Checklist

  • I wrote a PR title in English and added an appropriate label to the PR.
  • I wrote the commit message in English and to follow the Conventional Commits specification.
  • I added the changeset about the changes that needed to be released. (or didn't have to)
  • I wrote or updated documentation related to the changes. (or didn't have to)
  • I wrote or updated tests related to the changes. (or didn't have to)
  • I tested the changes in various browsers. (or didn't have to)
    • Windows: Chrome, Edge, (Optional) Firefox
    • macOS: Chrome, Edge, Safari, (Optional) Firefox

Related Issue

Summary

AlphaIcon 컴포넌트 구현

Details

  • AlphaIcon 컴포넌트를 구현합니다. 사이즈 확장과 접근성 속성 추가 외 기존 아이콘과 다른 점은 없습니다.
  • Source size 토큰을 추가합니다. 이 값은 Avatar, Icon 사이즈에서 모두 사용됩니다. AlphaAvatar 컴포넌트군에도 변경을 적용했습니다.
  • AlphaIconButton 에서 Icon 대신 AlphaIcon 을 사용하도록 합니다.

Breaking change? (Yes/No)

No

References

@sungik-choi sungik-choi added the feat Issue or PR related to a new feature label Dec 16, 2024
@sungik-choi sungik-choi self-assigned this Dec 16, 2024
Copy link

channeltalk bot commented Dec 16, 2024

Copy link

changeset-bot bot commented Dec 16, 2024

🦋 Changeset detected

Latest commit: 125c175

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 5 packages
Name Type
@channel.io/bezier-tokens Patch
@channel.io/bezier-react Patch
bezier-vscode Patch
@channel.io/stylelint-bezier Patch
bezier-figma-plugin Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@sungik-choi sungik-choi changed the title AlphaIcon Alpha Icon component Dec 16, 2024
Copy link

codecov bot commented Dec 16, 2024

Codecov Report

Attention: Patch coverage is 84.00000% with 4 lines in your changes missing coverage. Please review.

Project coverage is 81.90%. Comparing base (8c9b58c) to head (125c175).

Files with missing lines Patch % Lines
packages/bezier-react/src/utils/style.ts 50.00% 3 Missing ⚠️
...eact/src/components/AlphaIconButton/IconButton.tsx 0.00% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main    #2566      +/-   ##
==========================================
+ Coverage   81.86%   81.90%   +0.04%     
==========================================
  Files         145      147       +2     
  Lines        2889     2913      +24     
  Branches      920      917       -3     
==========================================
+ Hits         2365     2386      +21     
- Misses        494      497       +3     
  Partials       30       30              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

Copy link
Contributor

github-actions bot commented Dec 16, 2024

Chromatic Report

🚀 Congratulations! Your build was successful!

sungik-choi added a commit that referenced this pull request Dec 18, 2024
<!--
  How to write a good PR title:
- Follow [the Conventional Commits
specification](https://www.conventionalcommits.org/en/v1.0.0/).
  - Give as much context as necessary and as little as possible
  - Prefix it with [WIP] while it’s a work in progress
-->

## Self Checklist

- [x] I wrote a PR title in **English** and added an appropriate
**label** to the PR.
- [x] I wrote the commit message in **English** and to follow [**the
Conventional Commits
specification**](https://www.conventionalcommits.org/en/v1.0.0/).
- [x] I [added the
**changeset**](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md)
about the changes that needed to be released. (or didn't have to)
- [x] I wrote or updated **documentation** related to the changes. (or
didn't have to)
- [x] I wrote or updated **tests** related to the changes. (or didn't
have to)
- [x] I tested the changes in various browsers. (or didn't have to)
  - Windows: Chrome, Edge, (Optional) Firefox
  - macOS: Chrome, Edge, Safari, (Optional) Firefox

## Related Issue

<!-- Please link to issue if one exists -->

<!-- Fixes #0000 -->

## Summary

<!-- Please brief explanation of the changes made -->

bezier-tokens에서 scss 파일을 내보냅니다.

## Details

<!-- Please elaborate description of the changes -->

- 일부 유틸 클래스를 만드는 CSS 모듈에서 토큰에 대한 종류를 모두 알고있어야하는 불편함이 있었습니다. 이번에 #2566 PR
작업을 진행하면서 동일한 작업이 반복되는걸 느껴 이를 함께 수정합니다.
- bezier-tokens에서
[map-deep](https://styledictionary.com/reference/hooks/formats/predefined/#scssmap-deep)
포맷으로 scss output을 만들도록 합니다. 자바스크립트 케이스처럼 `index.scss` 를 만드는 과정을 추가했습니다.
- bezier-token의 `sideEffects` 필드에 scss 파일을 추가합니다.
- scss의 `pkg:` Importer 규칙에 따라 bezier-tokens의 conditional export field를
수정했습니다. bezier-react에선 storybook & build 과정 모두 상대 경로로 지정하는 게 잘 동작해서 pkg
프로토콜은 이 PR에서 사용하지 않았습니다 (시간이 좀 더 걸릴듯함)

### Breaking change? (Yes/No)

<!-- If Yes, please describe the impact and migration path for users -->

No

- ev-inner, ev-base 에 대한 유틸 클래스가 추가로 생기지만 사용처 영향은 없습니다 (매우 미미한 스타일 시트 파일
크기 상승)

## References

<!-- Please list any other resources or points the reviewer should be
aware of -->

-
https://sass-lang.com/documentation/js-api/classes/nodepackageimporter/
- https://webpack.kr/guides/tree-shaking/
@sungik-choi sungik-choi force-pushed the web-4647-2 branch 2 times, most recently from 025d6a2 to 3f3ef73 Compare December 23, 2024 06:06
@sungik-choi sungik-choi changed the title Alpha Icon component AlphaIcon component Dec 23, 2024
@@ -49,5 +40,5 @@
position: relative;
display: flex;
align-items: center;
height: var(--b-avatar-group-size);
height: 100%;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

테스트 시 구체적으로 높이를 지정하지 않아도 잘 동작함

@sungik-choi sungik-choi marked this pull request as ready for review December 30, 2024 06:10
@sungik-choi sungik-choi mentioned this pull request Dec 30, 2024
6 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feat Issue or PR related to a new feature
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant